<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style type="text/css">
        #text-indent{
            text-indent: 50px;
        }
        #text-transform{
            text-transform:uppercase ;
        }
        #text-decoration{
            /*text-decoration: overline;*/
            text-decoration: underline;
        }
        #text-align{
            text-align: center;
        }
        #word-spacing{
            word-spacing: 30px;
        }
        #white-space{
            white-space: pre;
        }
        #color{
            color: red;
        }
        #line-height{
            line-height:40px;
        }
        #font{
            font:italic bold 12px/20px arial,sans-serif;
        }
        #font-family{
            font-family: "Microsoft JhengHei";
        }
        #font-size{
            font-size: 40px;
        }
        #font-weight{
            font-weight: bolder;
        }
        #font-face{
            font-family: myFirstFont;
        }
        @font-face {
            font-family: myFirstFont;
            src: url(sansation_light.woff);
        }
    </style>
</head>
<body>
<div>
    <p id="text-indent">text-indent</p>
    <p id="text-transform">text-transform</p>
    <p id="text-decoration">text-decoration</p>
    <p id="text-align">text-align</p>
    <p id="word-spacing">word spacing</p>
    <p id="white-space">white         space</p>
    <p id="color">color</p>
    <p id="line-height">line-height</p>
    <p id="font">font</p>
    <p id="font-family">font-family</p>
    <p id="font-size">font-size</p>
    <p id="font-weight">font-weight</p>
    <p id="font-face">font-face</p>
</div>
</body>
</html>